<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:include="home/layout::html-head(pageTitle='Email通知设置 | ' + ${titleSuffix},pageKey=${pageKey},pageDesc=${pageDesc})" />
<!-- ADD THE CLASS layout-top-nav TO REMOVE THE SIDEBAR. -->
    <body class="layout-top-nav skin-black-light">
        <div class="wrapper">
            <header class="main-header" th:include="home/layout::main-header">
            </header>
            <!-- Full Width Column -->
            <div class="content-wrapper">
                <div class="container">
                    <!-- Main content -->
                    <section class="content">
                        <!-- /.box -->
                        <th:block th:include="home/layout::user-left-bar" />
                        <div class="col-md-9" id="app-avatar-edit">
                            <div th:class="|panel panel-default|">
                                <div class="panel-body ">
                                    <h2><i class="fa fa-cog" aria-hidden="true"></i> Email 通知设置</h2>
                                    <hr>
                                    <form class="form-horizontal" method="POST" accept-charset="UTF-8" enctype="multipart/form-data">
                                        <div class="form-group" style="margin-left: auto">
                                            <div class="checkbox">
                                                <label>
                                                    <input type="checkbox" v-model="form.field.emailNotify">
                                                    开启邮件通知
                                                </label>
                                            </div>

                                            <div class="checkbox">
                                                <label>
                                                    <input type="checkbox" v-model="form.field.likeNotify" >
                                                    屏蔽点赞通知
                                                </label>
                                            </div>
                                        </div>
                                        <button class="btn btn-lg btn-primary" @click="submitForm()"  id="upload-button" type="button">应用修改</button>
                                    </form>
                                </div>
                            </div>
                            <th:block th:include="home/layout::modal" />
                        </div>
                    </section>
                    <!-- /.content -->
                </div>
                <!-- /.container -->
            </div>
            <!-- /.content-wrapper -->
            <footer class="main-footer" th:include="home/layout::main-footer" />
        </div>
        <!-- ./wrapper -->
        <th:block th:include="home/layout::main-script" />

        <script>
            var appUserAvatar = new Vue({
                el:'#app-avatar-edit',
                data () {
                    return {
                        form:{
                            field:{

                            },
                            error:{

                            }
                        },
                        dialogTitle:'',
                        dialogContent:'',
                        isSuccess:true,
                        hasError:''
                    }
                },
                created() {
                    this.getData();
                },
                methods:{
                    getData() {
                        var _this = this;

                        $.post('/user/getData',null,function(response) {
                            _this.form.field = response
                        },'json',_this);
                    },
                    submitForm() {
                        var _this = this;
                        $.post('/user/edit',this.form.field,function(response) {
                            if (response.status === true) {
                                _this.dialogTitle = "修改用户信息";
                                _this.dialogContent = "修改成功";
                                $('#dialogTip').modal({
                                    keyboard: true
                                })
                            } else {
                                _this.dialogTitle = "修改用户信息";
                                _this.dialogContent = response.content;
                                $('#dialogTip').modal({
                                    keyboard: true
                                })
                            }
                        },'json',_this);

                    },

                }
            });
        </script>
    </body>
</html>
